<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
	<title>免费注册</title>
	<style type="text/css">
	*{
		margin: 0;
		padding:0;
					font-family: "微软雅黑";
	}
		body{
			width: 100%;
			height: 100%;
		}
		.ejct{
			display: none;
			width: 70%;
			height: 30%;
			position:absolute;
			top: 50%;
			margin: -25% 15% 0 15%;
			border: 1px solid #ccc;
			z-index: 666;
			background: white;
		}
		.str{
			width: 80%;
			height:50%;
			position: absolute;
			left:10%;
			padding-top: 20%;
			text-align: center;
		}
		.btn{
			display: block;
			width: 30%;
			height: 20%;
			position: absolute;
			bottom:10%;
			left: 35%;
			text-align: center;
			border: none;
			background: #ccc;
		}
		li{
			list-style: none;
		}
		.main{
			position: absolute;
			width: 100%;
			height: 100%;
		}
		.logo img{
			position: absolute;
			width: 33.3333%;
			margin-left: 33.3333%;
			margin-top: 18%;
		}
		.content{
			position: absolute;
			width: 80%;
			height: 50%;
			bottom:10%;
			left:10%;
		}
		.content ul{
			width: 100%;
			height:35%;
			float:left;
			border-radius: 2%;
			border:1px solid #14c29f;
			margin-bottom:10%;
		}
		.content li{
			width: 100%;
			height: 50%;
			float: left;
			border-bottom:1px solid #14c29f;
		}
		li input{
			float: left;
			height: 90%;
			width: 94%;
			border: none;
			outline: none;
			margin-left: 3%;
			font-size: 1rem;
			margin-top: 0.8%;
		}
		#li1{
			border: none;
		}
		#vft_code,#obtain{
			float: left;
			border: none;
			height: 90%;
		}
		#vft_code{
			width: 50%;
		}
		#obtain{
			width: 40%;
			background: none;
			border-left: 1px solid #14c29f;
			color: #2b2b2b;
		}
		#submit,#back{
			height: 17%;
			width: 47%;
			background: #00abfd;
			border: none;
			color: white;
			border-radius: 
		}
		#back{
			float: right;
			background: #b2b2b2;
		}
	</style>
</head>
<body>
	<div class="ejct">
		<ul>
			<li class="str"></li>
			<input type="button" value="确定" class="btn">
		</ul>
	</div>
	<div class="main">
		<div class="logo">
			<img src="../../image/my/logo.png">
		</div>
		<div class="content">
			<ul>
				<li><input type="text" placeholder="请输入您的手机号" id="usernameMid"></li>
				<li id="li1"><input type="text" placeholder="输入验证码" id="vft_code"><input type="button" value="获取验证码" id="obtain"></li>
			</ul>
			<input type="button" value="注册" id="submit" ><input type="button" value="返回登录页面" id="back">
			
		</div>
	</div>
	<script type="text/javascript" src="../../script/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="../../script/common.js"></script>
	<script type="text/javascript">
		$("#back").click(function(){
		var sTr=window.localStorage;
			sTr.clear();
			window.location.href="../login.html"; 
		});
		
		$("#obtain").click(function(){
			var mid=$('#usernameMid').val();
			if(mid.length==11&&_checkPhone(mid))
			{
				var post="regmid="+mid;
				ajaxcocRequest('../../../api/account/sendCode', 'post', post, function(msg){
					if(msg.code ==100){
						alert("短信发送成功");
					}else{
						$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')
					}
				});	
			}else
			{
				alert("请输入正确的手机号");
			}
		});
		$("#submit").click(function(){
			var mid=$('#usernameMid').val();
			var code=$('#vft_code').val();
			if(mid.length==11&&_checkPhone(mid)&&code.length==6&&_isNumber(code))
			{
				var post="mid="+mid+"&code="+code;
				
				ajaxcocRequest('../../../api/account/register', 'post', post, function(msg){
					if(msg.code ==100){
						alert("注册成功！");
					}else{
						
						alert(msg.message);
						<!--$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')-->
					}
				});	
			}else{
				alert("您输入的信息有误，请重新输入！");
			}
		});
		
	</script>
</body>
</html>